<template>
    <div class="categroy">
        <h2>{{title}}</h2>
        <!-- <ul>
            <li v-for="(item,index) in listdata" :key="index">{{item}}</li>
        </ul> -->
        <!-- 插槽 slot标签 在外部传入de结构放在这里-->
         <!-- <slot></slot> -->
        <!-- 具名插槽  添加了name属性 -->
        <slot name="center"></slot>
        <slot name="fooder"></slot>
    </div>
</template>

<script>
export default {
    name:'defaultSlot',
    props:['listdata','title']
}
</script>

<style>
    .categroy{
        width: 200px;
        height: 300px;
        background-color: rgb(146, 190, 231);
    }
    .categroy h2{
        background-color: orange;
        text-align: center;
    }
</style>